<template>
    <div>
        <div>
            <el-form :model="form" label-suffix="：" ref="form" :rules="rules" label-width="120px" >
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item :label="$t('label.schoolTerm')">
                            <el-input v-model="form.yearTermI18n" :disabled="true" ></el-input>
                        </el-form-item>
                    </el-col>
                    <span v-show="showMore">
                      <el-col :span="12">
                          <el-form-item :label="$t('label.stuCode')" prop="stuNo">
                              <el-input v-model="form.stuNo" maxlength="100" :disabled="true" ></el-input>
                          </el-form-item>
                      </el-col>
                      <el-col :span="12">
                          <el-form-item :label="$t('label.stuName')" prop="stuName">
                              <el-input v-model="form.stuName" maxlength="20" :disabled="true" ></el-input>
                          </el-form-item>
                      </el-col>
                    </span>
                    <el-col :span="12">
                        <el-form-item :label="$t('achievementApply.thesisTitle')" prop="thesisTitle">
                            <el-input v-model="form.thesisTitle" maxlength="100" :disabled="true" ></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <!-- 评审结果页面 -->
                <el-row :gutter="20" v-if="type!=='apply'">
                  <el-col :span="12">
                    <el-form-item prop="evaResult" :label="$t('paperBlindTrial.assessResult')">
                      <el-select v-model="form.evaResult" placeholder="" :disabled="viewState" style="width: 100%">
                        <el-option v-for="item in options.resultType" :key="item.value" :label="item.label" :value="item.value"></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <!-- 不可编辑的时候展示文件名信息 -->
                  <el-col :span="12">
                    <div v-if="viewState" class="link_style" @click="downLoadFunc(form.fileObj)">{{form.fileObj.attachName}}</div>
                    <el-form-item v-else label="" label-width="0px" prop="evaFileName">
                      <el-upload
                        ref="evaFileNameUpload"
                        :headers="{'X-Token': $store.state.session.sessionid}"
                        :action="uploadAction"
                        :data="{bucketname: 'face', folderpath: 'file'}"
                        :limit="1"
                        accept=".pdf"
                        :before-upload="beforeUpload"
                        :on-exceed="handleExceed"
                        :on-success="uploadDone">
                        <el-button size="small" type="primary">{{$t('common.btn.clickUpload')}}</el-button>
                        <div slot="tip" class="el-upload__tip">{{$t('paperBlindTrial.onePdfAndSize')}}</div>
                      </el-upload>
                    </el-form-item>
                  </el-col>
                </el-row>
                <!-- 学生查看页面 -->
                <span v-if="type==='apply'" >
                  <el-row :gutter="20" v-for="(itemObj, index) in evaResult" :key="index">
                    <el-col :span="12">
                      <el-form-item :label="$t('paperBlindTrial.assessResult')+(index+1)">
                        <el-select v-model="itemObj.evaResult" placeholder="" :disabled="true" style="width: 100%">
                          <el-option v-for="item in options.resultType" :key="item.value" :label="item.label" :value="item.value"></el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <div class="link_style" @click="downLoadFunc(itemObj.evaAttachTs)">{{itemObj.evaFileName}}</div>
                    </el-col>
                  </el-row>
                </span>
            </el-form>
        </div>
    </div>
</template>

<script>
import { reviewResultInput, applyEnterDetail, commonDownload, commonUpload } from "common/src/api/paperBlindTrial";
import commonMixins from 'common/src/views/practiceManagement/commonMixins';
export default {
    components: {},
    mixins: [commonMixins],
    props: {
      // 默认不能编辑
      viewState: {
        type: Boolean,
        default: true
      },
      // 展示姓名和学号信息
      showMore: {
        type: Boolean,
        default: false
      },
      row: {
        type: Object
      },
      type: { // 默认为空，apply表示是学生查看记录页面
        type: String,
        default: ''
      }
    },
    data() {
        return {
            uploadAction: commonUpload,
            form: {
              yearTermI18n: '',
              stuNo: '',
              stuName: '',
              thesisTitle: '',
              fileObj: {}
            },
            options: {
              resultType: []
            },
            rules: {
              evaResult: [{ required: true, message: this.$t('common.pla.pleaseSelect'), trigger: 'change' }],
              // evaResult: [{ required: true, validator: (rule, value, callback)=>this.validateFile(rule, value, callback, `evaFileName${n}Upload`), trigger: 'change' } ],,
              evaFileName: [{ required: true, validator: this.validateFile, trigger: 'change' } ],
            },
            evaResult: [] // 录入结果
        };
    },
    computed: {

    },
    created() {

    },
    mounted() {
      let param = {
        BLIND_REVIEW_RESULT: 'resultType', // 评审结果字典
      };
      this.initOptions(param);
      // id存在则查详情数据
      if (this.row.applyId) {
        this.getDetail(this.row);
      }
      // 学生查看详情页面需要单独调用查询评审集合组的接口
    },
    methods: {
      // 根据送审专家数动态生成表单
      // initForm () {
      //   for (let index in this.row.evaExpertCount) {

      //   }
      // },
      // 根据申请id查询详情
      getDetail (row) {
        applyEnterDetail(row).then(res => {
          if (res.code === 200) {
            let data = res.data;
              this.form.yearTermI18n = data.yearTermI18n;
              this.form.stuNo = data.stuNo;
              this.form.stuName = data.stuName;
              this.form.thesisTitle = data.thesisTitle;
            if (this.viewState) {
              this.rules = [];
              if (this.type === 'apply') { // 学生查看
                this.evaResult = data.evaResultTs;
              } else {
                let evaResultTs = data.evaResultTs[0] || {};
                this.form.evaResult = evaResultTs.evaResult;
                this.form.fileObj = evaResultTs.evaAttachTs || {};
              }
            }
          }
        });
      },
      // 保存方法
      save () {
        this.$refs.form.validate((valid) => {
          if (valid) {
            let param = [];
            let obj = {
              id: this.row.resultId,
              "applyId": this.row.applyId,   //申请id
              "evaResult":  this.form.evaResult,   //评审结果
              evaAttachTs: [this.form.evaAttachTs], // 附件对象
            };
            param.push(obj);
            reviewResultInput(param).then(res=>{
              if (res.code === 200) {
                this.$message.success(this.$t('paperBlindTrial.inputSuccess'));
                this.$emit('emit:back');
              }
            });
          }
        });
      },
      beforeUpload (file) {
        const isPDF = file.type === 'application/pdf';

        if (!isPDF) {
          this.$message.error(this.$t('paperBlindTrial.pdfFileTips'));
          return false;
        }
        if (file.size > 3145728) {  // 目前设置限制3M
          this.$message.error(this.$t('paperBlindTrial.sizeTips'));
          return false;
        }
        return true;
      },
      handleExceed(files, fileList) {
        this.$message.warning(this.$t('paperBlindTrial.oneFileTips'));
      },
      // 下载附件方法
      downLoadFunc (fileInfo) {
        commonDownload(fileInfo.attachPath, fileInfo.attachName, 'application/pdf');
      },
      // 校验上传文件
      validateFile (rule, value, callback) {
        // if (!this.$refs[uploadRef].uploadFiles.length) {
        if (!this.$refs.evaFileNameUpload.uploadFiles.length) {
          return callback(new Error(this.$t('paperBlindTrial.emptyFileTips')));
        }
        return callback();
      },
      uploadDone (res, file) {
        let jsons = {
          attachName: file.name,
          attachSize: file.size,
          attachType: 'pdf',
          attachPath: Object.values(res.data)[0].objectkey
        };
        this.form.evaAttachTs = jsons;
        this.$refs.form.validateField('evaFileName');
      },
    }
};
</script>

<style scoped lang="scss">
.con {
    &_footer {
        display: flex;
        flex-direction: row-reverse;
        &_sure {
            margin-left: 20px;
        }
    }
}
.link_style {
  margin: 10px 0 0 10px;
  cursor: pointer;
  color: #3A7FE8;
}
</style>
